<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>设置服务地址</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            padding: 20px;
        }

        .form-group {
            margin-bottom: 15px;
        }

        label {
            display: block;
            margin-bottom: 5px;
        }

        input[type="text"] {
            width: 100%;
            padding: 8px;
            box-sizing: border-box;
        }

        button {
            padding: 10px 15px;
            background-color: #28a745;
            color: white;
            border: none;
            cursor: pointer;
        }

        button:hover {
            background-color: #218838;
        }
    </style>
</head>

<body>
    <h2>设置服务地址</h2>
    <form id="serverSettingsForm">
        <div class="form-group">
            <label for="server-address">服务器地址:</label>
            <input type="text" id="server-address" name="serverAddress" required>
        </div>
        <button type="submit">保存设置</button>
    </form>

    <script>
        // 加载时尝试恢复之前保存的服务地址（如果有的话）
        document.addEventListener('DOMContentLoaded', async (event) => {
            try {
                const savedAddress = await window.electronAPI.getServerAddress();
                if (savedAddress) {
                    document.getElementById('server-address').value = savedAddress;
                }
            } catch (error) {
                console.error('Failed to get server address:', error);
            }
        });

        // 表单提交事件监听器
        document.getElementById('serverSettingsForm').addEventListener('submit', async (event) => {
            event.preventDefault(); // 阻止默认提交行为

            const serverAddress = document.getElementById('server-address').value;
            console.log(`Server address set to: ${serverAddress}`);

            try {
                // 发送新服务地址到主进程进行保存
                await window.electronAPI.saveServerAddress(serverAddress);
                alert('服务地址已成功保存！');
            } catch (error) {
                console.error('Failed to save server address:', error);
                alert('保存服务地址失败，请重试！');
            }
        });
    </script>
</body>

</html>